<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>商城购物首页</title>
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport"/>
    <meta content="yes" name="apple-mobile-web-app-capable"/>
    <meta content="black" name="apple-mobile-web-app-status-bar-style"/>
    <meta content="telephone=no" name="format-detection"/>
    <link href="/shopping/css/style.css" rel="stylesheet" type="text/css"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache, must-revalidate">
    <link rel="stylesheet" href="/js/bootstrap-4.1.1-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/font/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="/css/reset.css">
    <script type="text/javascript" src="shopping/js/jquery.min.js"></script>
    <script type="text/javascript" src="shopping/js/slider.js"></script>
    <script src="/js/jquery/jquery.min.js"></script>
    <script src="/js/plugins/jrender/jrender.min.js"></script>
    <script src="/js/checkLogin.js"></script>
    <script src="/js/common.js"></script>

    <script>
        $(function () {
            //获取所有热门目录
            $.get(baseUrl + "/productCatalogs", {state: 1}, function (data) {
                console.log(data);
                $("#productCatalogId").renderValues({list: data}, {
                    getHref: getHref
                });
            });
            //获取所有热门的品牌
            $.get(baseUrl + "/productBrands", {state: 1}, function (data) {
                $("#productBrandId").renderValues({list: data}, {
                    getHref: getHref
                });
            });
        });
    </script>
</head>
<body>

<section class="aui-flexView">
    <header class="aui-navBar aui-navBar-fixed">
        <a href="javascript:;" class="aui-navBar-item">北京
            <i class="icon icon-return"></i>
        </a>
        <div class="aui-center">
            <div class="aui-search-box">
                <i class="icon icon-search"></i>
                <input type="text" placeholder="夏日幼儿防晒霜">
            </div>

        </div>
        <a href="javascript:;" class="aui-navBar-item">
            <i class="icon icon-car"></i>
        </a>
    </header>
    <section class="aui-scrollView">
        <div class="m-slider" data-ydui-slider>
            <div class="slider-wrapper">
                <div class="slider-item">
                    <a href="javascript:;">
                        <img src="shopping/images/banner.png" alt="">
                    </a>
                </div>
                <div class="slider-item">
                    <a href="javascript:;">
                        <img src="shopping/images/banner.png" alt="">
                    </a>
                </div>
                <div class="slider-item">
                    <a href="javascript:;">
                        <img src="shopping/images/banner.png" alt="">
                    </a>
                </div>
                <div class="slider-item">
                    <a href="javascript:;">
                        <img src="shopping/images/banner.png" alt="">
                    </a>
                </div>
                <div class="slider-item">
                    <a href="javascript:;">
                        <img src="shopping/images/banner.png" alt="">
                    </a>
                </div>
            </div>
            <div class="slider-pagination"></div>
        </div>
        <div class="aui-palace b-line">
            <a href="/newProductPage.html" class="aui-palace-grid" >
                <div class="aui-palace-grid-icon">
                    <img src="shopping/images/nav-001.png" alt="">
                </div>
                <div class="aui-palace-grid-text">
                    <h2>新品上市</h2>
                </div>
            </a>
            <a href="/specialPricePage.html" class="aui-palace-grid">
                <div class="aui-palace-grid-icon">
                    <img src="shopping/images/nav-002.png" alt="">
                </div>
                <div class="aui-palace-grid-text">
                    <h2>特价</h2>
                </div>
            </a>
            <a href="/rechargePage.html" class="aui-palace-grid">
                <div class="aui-palace-grid-icon">
                    <img src="shopping/images/nav-003.png" alt="">
                </div>
                <div class="aui-palace-grid-text">
                    <h2>充值</h2>
                </div>
            </a>
            <a href="javascript:;" class="aui-palace-grid">
                <div class="aui-palace-grid-icon">
                    <img src="shopping/images/nav-004.png" alt="">
                </div>
                <div class="aui-palace-grid-text">
                    <h2>团购</h2>
                </div>
            </a>
            <a href="javascript:;" class="aui-palace-grid">
                <div class="aui-palace-grid-icon">
                    <img src="shopping/images/nav-005.png" alt="">
                </div>
                <div class="aui-palace-grid-text">
                    <h2>关注</h2>
                </div>
            </a>
            <a href="javascript:;" class="aui-palace-grid">
                <div class="aui-palace-grid-icon">
                    <img src="shopping/images/nav-006.png" alt="">
                </div>
                <div class="aui-palace-grid-text">
                    <h2>订单</h2>
                </div>
            </a>
            <a href="javascript:;" class="aui-palace-grid">
                <div class="aui-palace-grid-icon">
                    <img src="shopping/images/nav-007.png" alt="">
                </div>
                <div class="aui-palace-grid-text">
                    <h2>优惠</h2>
                </div>
            </a>
            <a href="javascript:;" class="aui-palace-grid">
                <div class="aui-palace-grid-icon">
                    <img src="shopping/images/nav-008.png" alt="">
                </div>
                <div class="aui-palace-grid-text">
                    <h2>门店</h2>
                </div>
            </a>
            <a href="javascript:;" class="aui-palace-grid">
                <div class="aui-palace-grid-icon">
                    <img src="shopping/images/nav-009.png" alt="">
                </div>
                <div class="aui-palace-grid-text">
                    <h2>购物</h2>
                </div>
            </a>
            <a href="javascript:;" class="aui-palace-grid">
                <div class="aui-palace-grid-icon">
                    <img src="shopping/images/nav-010.png" alt="">
                </div>
                <div class="aui-palace-grid-text">
                    <h2>更多</h2>
                </div>
            </a>
        </div>
        <div class="divHeight b-line"></div>
        <div class="aui-flex aui-fleTen b-line">
            <div class="aui-flex-box">
                <i class="icon icon-time"></i>
                <h2 class="aui-title-time">限时抢购</h2>
                <div class="aui-limit-time clearfix">
                    <!--<div class="aui-fl-time">距结束</div>-->
                    <div class="time-item">
                        <span class="hour_show">00</span>
                        <em>:</em>
                        <span class="minute_show">00</span>
                        <em>:</em>
                        <span class="second_show">00</span>
                    </div>
                </div>
            </div>
        </div>
        <div class="aui-flex aui-flex-sel b-line">
            <div class="aui-flex-box aui-flex-box-one">
				<span>
					<img src="shopping/images/tag1.png" alt="">
				</span>
                <h1>韩国创意雨伞18骨雨伞</h1>
                <p>纳米技术强力抗水</p>
                <img src="shopping/images/pd-001.png" alt="">
            </div>
            <div class="aui-flex-box">
				<span>
					<img src="shopping/images/tag2.png" alt="">
				</span>
                <h1>快来抢小妖王了</h1>
                <p>纳米技术强力抗水</p>
                <img src="shopping/images/pd-002.png" alt="">
            </div>
        </div>

        <div class="aui-flex aui-flex-sel  aui-flex-sel-one b-line">
            <div class="aui-flex-box aui-flex-box-one">
                <h1>微单相机</h1>
                <p>错过不再有</p>
                <img src="shopping/images/pd-003.png" alt="">
            </div>
            <div class="aui-flex-box aui-flex-box-one">
                <h1>平板电脑</h1>
                <p>纳米技术强力抗水</p>
                <img src="shopping/images/pd-004.png" alt="">
            </div>
            <div class="aui-flex-box ">
                <h1>拍立得神奇</h1>
                <p>纳米技术强力抗水</p>
                <img src="shopping/images/pd-005.png" alt="">
            </div>

        </div>

        <div class="aui-palace aui-palace-two b-line">
            <a href="javascript:;" class="aui-palace-grid">
                <div class="aui-info-text">
                    <h2>持久保湿</h2>
                    <p>兰蔻小样限时抢购</p>
                    <span>入场疯抢</span>
                </div>
                <div class="aui-info-img">
                    <img src="shopping/images/pd-006.png" alt="">
                </div>
            </a>
            <a href="javascript:;" class="aui-palace-grid">
                <div class="aui-info-text">
                    <h2>持久保湿</h2>
                    <p>兰蔻小样限时抢购</p>
                    <span>入场疯抢</span>
                </div>
                <div class="aui-info-img">
                    <img src="shopping/images/pd-007.png" alt="">
                </div>
            </a>
        </div>

        <div class="divHeight b-line"></div>
        <div class="aui-flex aui-fleTen b-line">
            <div class="aui-flex-box">
                <h2 class="aui-title-time fl-line">热门频道</h2>
            </div>
            <div class="aui-arrow">
                <span>更多频道</span>
            </div>
        </div>
        <div id="productCatalogId">
            <div render-loop="list" class="aui-flex aui-flex-sel  aui-flex-sel-one aui-flex-sel-two b-line">
                <div class="aui-flex-box aui-flex-box-one">
                    <a data-url="/productPage.html?id=" render-key="list.id" render-fun="getHref">
                        <h1 render-html="list.title">服装城</h1>
                        <p render-html="list.subTitle">错过不再有</p>
                        <img render-src="list.coverUrl" alt="">
                    </a>
                </div>
            </div>
        </div>


        <div class="divHeight b-line"></div>
        <div class="aui-flex aui-fleTen b-line">
            <div class="aui-flex-box">
                <h2 class="aui-title-time fl-line">品牌优购</h2>
            </div>
            <div class="aui-arrow">
                <span>更多品牌</span>
            </div>
        </div>
        <div id="productBrandId">
            <div render-loop="list" class="aui-flex aui-flex-sel  aui-flex-sel-one b-line">
                <div class="aui-flex-box aui-flex-box-one">
                    <a data-url="/productPage.html?id=" render-key="list.id" render-fun="getHref">
                        <h1 render-html="list.title">微单相机</h1>
                        <img render-src="list.coverUrl" alt="">
                    </a>
                </div>
            </div>
        </div>

        <div class="aui-recommend b-line">
            <h2>精品推荐</h2>
            <div class="aui-list-theme">
                <a href="javascript:;" class="aui-list-theme-item">
                    <div class="aui-list-img">
                        <img src="shopping/images/pd-014.png" alt="">
                    </div>
                    <div class="aui-list-title">
                        <h3>淘宝运营系列课程，让懂淘宝的人教你少走一些弯路 赶紧加入吧</h3>
                        <p><em>￥9.99</em> <i class="icon icon-collect"></i></p>
                    </div>
                </a>
                <a href="javascript:;" class="aui-list-theme-item">
                    <div class="aui-list-img">
                        <img src="shopping/images/pd-015.png" alt="">
                    </div>
                    <div class="aui-list-title">
                        <h3>淘宝运营系列课程，让懂淘宝的人教你少走一些弯路 赶紧加入吧</h3>
                        <p><em>￥9.99</em> <i class="icon icon-collect"></i></p>
                    </div>
                </a>
                <a href="javascript:;" class="aui-list-theme-item">
                    <div class="aui-list-img">
                        <img src="shopping/images/pd-016.png" alt="">
                    </div>
                    <div class="aui-list-title">
                        <h3>淘宝运营系列课程，让懂淘宝的人教你少走一些弯路 赶紧加入吧</h3>
                        <p><em>￥9.99</em> <i class="icon icon-collect"></i></p>
                    </div>
                </a>
                <a href="javascript:;" class="aui-list-theme-item">
                    <div class="aui-list-img">
                        <img src="shopping/images/pd-017.png" alt="">
                    </div>
                    <div class="aui-list-title">
                        <h3>淘宝运营系列课程，让懂淘宝的人教你少走一些弯路 赶紧加入吧</h3>
                        <p><em>￥9.99</em> <i class="icon icon-collect"></i></p>
                    </div>
                </a>
                <a href="javascript:;" class="aui-list-theme-item">
                    <div class="aui-list-img">
                        <img src="shopping/images/pd-018.png" alt="">
                    </div>
                    <div class="aui-list-title">
                        <h3>淘宝运营系列课程，让懂淘宝的人教你少走一些弯路 赶紧加入吧</h3>
                        <p><em>￥9.99</em> <i class="icon icon-collect"></i></p>
                    </div>
                </a>
                <a href="javascript:;" class="aui-list-theme-item">
                    <div class="aui-list-img">
                        <img src="shopping/images/pd-019.png" alt="">
                    </div>
                    <div class="aui-list-title">
                        <h3>淘宝运营系列课程，让懂淘宝的人教你少走一些弯路 赶紧加入吧</h3>
                        <p><em>￥9.99</em> <i class="icon icon-collect"></i></p>
                    </div>
                </a>
                <a href="javascript:;" class="aui-list-theme-item">
                    <div class="aui-list-img">
                        <img src="shopping/images/pd-020.png" alt="">
                    </div>
                    <div class="aui-list-title">
                        <h3>淘宝运营系列课程，让懂淘宝的人教你少走一些弯路 赶紧加入吧</h3>
                        <p><em>￥9.99</em> <i class="icon icon-collect"></i></p>
                    </div>
                </a>
                <a href="javascript:;" class="aui-list-theme-item">
                    <div class="aui-list-img">
                        <img src="shopping/images/pd-021.png" alt="">
                    </div>
                    <div class="aui-list-title">
                        <h3>淘宝运营系列课程，让懂淘宝的人教你少走一些弯路 赶紧加入吧</h3>
                        <p><em>￥9.99</em> <i class="icon icon-collect"></i></p>
                    </div>
                </a>
            </div>
            <div style="height:55px"></div>
        </div>

    </section>
    <footer class="aui-footer aui-footer-fixed">
        <a href="javascript:;" class="aui-tabBar-item aui-tabBar-item-active">
                <span class="aui-tabBar-item-icon">
                    <i class="icon icon-loan"></i>
                </span>
            <span class="aui-tabBar-item-text">首页</span>
        </a>
        <a href="/productPage.html;" class="aui-tabBar-item ">
                <span class="aui-tabBar-item-icon">
                    <i class="icon icon-credit"></i>
                </span>
            <span class="aui-tabBar-item-text">分类</span>
        </a>
        <a href="javascript:;" class="aui-tabBar-item ">
                <span class="aui-tabBar-item-icon">
                    <i class="icon icon-ions"></i>
                </span>
            <span class="aui-tabBar-item-text">购物车</span>
        </a>
        <a href="javascript:;" class="aui-tabBar-item ">
                <span class="aui-tabBar-item-icon">
                    <i class="icon icon-car"></i>
                </span>
            <span class="aui-tabBar-item-text">我的</span>
        </a>
    </footer>
</section>
</body>

<script type="text/javascript">

    var intDiff = parseInt(12000);

    //倒计时总秒数量

    function timer(intDiff) {
        window.setInterval(function () {
            var day = 00
                , hour = 00
                , minute = 00
                , second = 00;
            //时间默认值
            if (intDiff > 0) {
                day = Math.floor(intDiff / (60 * 60 * 24));
                hour = Math.floor(intDiff / (60 * 60)) - (day * 24);
                minute = Math.floor(intDiff / 60) - (day * 24 * 60) - (hour * 60);
                second = Math.floor(intDiff) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
            }
            if (minute <= 9)
                minute = '0' + minute;
            if (second <= 9)
                second = '0' + second;
            $('.hour_show').html('0<s id="h"></s>' + hour + ' ');
            $('.minute_show').html('<s></s>' + minute + ' ');
            $('.second_show').html('<s></s>' + second + ' ');
            intDiff--;
        }, 1000);
    }

    $(function () {
        timer(intDiff);
    });
</script>
</html>
